import { Component } from 'react'
import People from './People.js'

export default class Group extends Component{
  state = {
    info:this.props.info
  }
  changeShow = () => {
    let info = this.state.info;
    info.isShowSubList = !info.isShowSubList
    this.setState({
      info:info
    })
  }
  render() {
    const info = this.state.info
    return <div className="group">
      <div className="group-title" onClick={this.changeShow}>{info.title}</div>
      <div className={info.isShowSubList?'sub-list':'sub-list-hidden'}>
        {info.subList.map((item, index) => {
          return <People key={index} people={item}/>
        })}
      </div>
    </div>;
  }
}